<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>
  <link rel="stylesheet" href="assets/css/index.css">
  <link rel="stylesheet" href="assets//css/init.css">
</head>

<body>
  <div class="main-page">
    <div class="background element"></div>
    <div class="perspect">
      <div class="linear">
        <section class="layer sec1">
          <div class="element mubu">
            <img src="assets/images/mubu.webp" alt="">
          </div>
          <div class="element home">
            <img src="assets/images/home.webp" alt="">
          </div>
          <div class="element door-static">
            <div class="door-text">
              <span class="t1">开门</span>
              <span class="t2">大吉</span>
            </div>
            <div class="cursor">
              <span class="cursor-tip"> 点击开门</span>
            </div>
            <img src="assets/images/doors.webp" alt="">
          </div>
          <div class="element door">
            <img src="assets/images/open-door.gif" alt="">
          </div>
          <div class="element light">
            <img src="assets/images/light.webp" alt="">
          </div>
          <div class="element shu shu1">
            <img src="assets/images/shu1.webp" alt="">
          </div>
          <div class="element shu shu2">
            <img src="assets/images/shu2.webp" alt="">

          </div>
        </section>
        <section class="layer sec2">
          <div class="element pillar">
            <img src="./assets/images/pillar.webp" alt="">
            <span>福鼠贺岁</span>
          </div>
          <div class="element pillar pillar2">
            <img src="./assets/images/pillar.webp" alt="">
            <span>鼠年大吉</span>
          </div>
        </section>
        <section class="layer sec3">
          <div class="element home">
            <img src="./assets/images/home2.webp" alt="">
            <span class="text t1">金猪摇尾辞旧岁</span>
            <span class="text t2">玉鼠探头迎新春</span>
          </div>
          <div class="element happy">
            <img src="./assets/images/happy.webp" alt="">
          </div>
          <div class="element papa">
            <img src="./assets/images/papa.webp" alt="">
          </div>
          <div class="element mama">
            <img src="./assets/images/mama.webp" alt="">
          </div>
        </section>
        <section class="layer sec4">
          <div class="element pillar">
            <img src="./assets/images/pillar.webp" alt="">
            <span>春满九州</span>
          </div>
          <div class="element pillar pillar2">
            <img src="./assets/images/pillar.webp" alt="">
            <span>香飘四季</span>
          </div>
        </section>
        <section class="layer sec5">
          <div class="element bg">
            <img src="./assets/images/card-bg.webp" alt="" class="under">
            <img src="./assets/images/card-corner.webp" alt="" class="corner">
            <img src="./assets/images/card-banner.webp" alt="" class="banner">
            <img src="./assets/images/card-banner2.webp" alt="" class="banner2">
            <img src="./assets/images/card-dl.webp" alt="" class="dl dl1">
            <img src="./assets/images/card-dl.webp" alt="" class="dl dl2">
            <img src="./assets/images/card-dl.webp" alt="" class="dl dl3">
            <img src="./assets/images/card-flower1.webp" alt="" class="flower1">
            <img src="./assets/images/card-cloud.webp" alt="" class="cloud1">
            <img src="./assets/images/card-year.webp" alt="" class="year">
            <img src="./assets/images/card-win.webp" alt="" class="win1">
            <img src="./assets/images/card-win.webp" alt="" class="win2">
            <img src="./assets/images/card-flower2.webp" alt="" class="flower2">
            <img src="./assets/images/card-flower2.webp" alt="" class="flower3">
            <img src="./assets/images/card-cloud.webp" alt="" class="cloud2">
            <img src="./assets/images/card-banner3.webp" alt="" class="banner3">
            <img src="./assets/images/card-sub.webp" alt="" class="date">
            <img src="./assets/images/card-border.webp" alt="" class="border">
            <span class="title"></span>
            <span class="word"></span>
            <span class="sub">二零二零年农历庚子年</span>
          </div>
          <div class="element fireworks">
            <div class="item item1">
              <img src="./assets/images/cardfireworks.webp" alt="" class="t1">
              <img src="./assets/images/cardfireworks.webp" alt="" class="t2">
            </div>
            <div class="item item2">
              <img src="./assets/images/cardfireworks.webp" alt="" class="t1">
              <img src="./assets/images/cardfireworks.webp" alt="" class="t2">
            </div>
            <div class="item item3">
              <img src="./assets/images/cardfireworks.webp" alt="" class="t1">
              <img src="./assets/images/cardfireworks.webp" alt="" class="t2">
            </div>
            <div class="item item4">
              <img src="./assets/images/cardfireworks.webp" alt="" class="t1">
              <img src="./assets/images/cardfireworks.webp" alt="" class="t2">
            </div>
            <div class="item item5">
              <img src="./assets/images/cardfireworks.webp" alt="" class="t1">
              <img src="./assets/images/cardfireworks.webp" alt="" class="t2">
            </div>
            <div class="item item6">
              <img src="./assets/images/cardfireworks.webp" alt="" class="t1">
              <img src="./assets/images/cardfireworks.webp" alt="" class="t2">
            </div>
          </div>
          <div class="element textbg">
            <img src="./assets/images/card-bg2.webp" alt="">
            <img src="./assets/images/snow.gif" alt="" class="snow">
          </div>
          <div class="element text">
            <img src="./assets//images/card-text1.webp" alt="">
            <img src="./assets/images/card-text2.webp" alt="">
            <img src="./assets/images/card-text3.gif" alt="">
            <img src="./assets/images/card-cloud.webp" alt="" class="cloud3">
            <img src="./assets/images/card-cloud2.webp" alt="" class="cloud2">
            <span class="btn">我也要拜年</span>
          </div>
        </section>
        <section class="layer sec6">
          <div class="element box">
            <div class="title">填写我的拜年语</div>
            <label for="name">我的名字（最多10个字）</label>
            <input type="text" name="name" maxlength="10">
            <label for="name">我的祝福语（最多10个字）</label>
            <input type="text" name="word" maxlength="10">
            <span class="generate">生成拜年页</span>
          </div>
        </section>
      </div>
    </div>
  </div>
  <script src="assets/js/jquery.min.js"></script>
  <script src="assets/js/index.js"></script>
</body>

</html>